<template>
    <div>
        <div class="login-wrap">
            <h3>登录</h3>
            <input type="text" placeholder="请输入用户名" v-model="loginForm.loginName"/>
            <input type="password" placeholder="请输入密码" v-model="loginForm.password"/>
            <button v-on:click="login">登录</button>
        </div>

    </div>
</template>

<script>
    import {login} from '../api/getData'
    import {setCookie} from "../utils/cookie";
    import {baseImgPath} from "../config/env";

    export default {
        name: "Login",
        data() {
            return {
                loginForm: {
                    loginName: '',
                    password: '',
                },
                token: '',
            }
        },
        created() {
            // window.setTimeout(()=>{this.$router.push('/index')}, 1000)
        },
        methods: {
            async login() {
                if (this.loginForm.username === '' || this.loginForm.password === '') {
                    alert('账号或密码不能为空');
                } else {
                    const res = await  login(this.loginForm);
                    if(res.data.code == 0){
                        localStorage.setItem("token", res.data.data.token)
                        setCookie('token', res.data.data.token, 60*60*24);
                        // setCookie('image', res.data.data.token, 60*60*24);
                        this.$store.commit('setToken', res.data.data.token)
                        if(res.data.data.user.image){
                            res.data.data.user.image = baseImgPath + res.data.data.user.image;
                        }else{
                            res.data.data.user.image = '';
                        }
                        this.$store.commit('saveAdminInfo', res.data.data.user);
                        this.$router.push('/home');
                    }
                    // this.axios({
                    //   method: 'post',
                    //   url: '/user/login',
                    //   data: this.loginForm
                    // }).then(res => {
                    //   console.log(res.data);
                    //   _this.userToken = 'Bearer ' + res.data.data.body.token;
                    //   // 将用户token保存到vuex中
                    //   _this.changeLogin({Authorization: _this.userToken});
                    //   _this.$router.push('/home');
                    //   alert('登陆成功');
                    // }).catch(error => {
                    //   alert('账号或密码错误');
                    //   console.log(error);
                    // });
                }
            },

            ToLogin() {

            },
            register() {

            },
            ToRegister() {

            }
        }
    }
</script>

<style scoped>
    .login-wrap {
        text-align: center;
    }

    input {
        display: block;
        width: 250px;
        height: 40px;
        line-height: 40px;
        margin: 0 auto;
        margin-bottom: 10px;
        outline: none;
        border: 1px solid #888;
        padding: 10px;
        box-sizing: border-box;
    }

    p {
        color: red;
    }

    button {
        display: block;
        width: 250px;
        height: 40px;
        line-height: 40px;
        margin: 0 auto;
        border: none;
        background-color: #41b883;
        color: #fff;
        font-size: 16px;
        margin-bottom: 5px;
    }

    span {
        cursor: pointer;
    }

    span:hover {
        color: #41b883;
    }
</style>
